<template>
  <div class="app-container">
    <!-- 卡片视图 -->
    <el-card style="margin-bottom: 20px">
      <el-steps :active="active" finish-status="success">
        <el-step title="步骤 1"></el-step>
        <el-step title="步骤 2"></el-step>
        <el-step title="步骤 3"></el-step>
      </el-steps>
    </el-card>

    <el-card>

      <div style="width: 100%;height: 100%;">
        <div v-show="active===0">
<!--          楼栋-->
          <selectOne :getFloorId="getFloorId"/>
        </div>
        <div v-show="active===1">
<!--          单元-->
          <selectTwo :getUnitId="getUnitId" :floorId="floorId"/>
        </div>
        <div v-show="active===2">
<!--          确认添加-->
          <selectThree :room="room"/>
        </div>
      </div>
      <div style="float: right;margin: 10px;">
        <el-button round size="mini" v-if="active!==0" @click="active--">上一步</el-button>
        <el-button type="primary" round size="mini" @click="next" v-text="active===2? '完成':'下一步'"></el-button>
      </div>
    </el-card>
  </div>
</template>

<script>
import selectOne from './housePage/selectOne'
import selectTwo from './housePage/selectTwo'
import selectThree from './housePage/selectThree'

import {addRooms} from '@/api/assets/room'
export default {
  name: "homeCheck",
  components:{selectOne,selectThree,selectTwo},
  data(){
    return{
      // 步骤计数
      active: 0,
      // 楼栋id
      floorId: 0,
      // 单元id
      unitId: 0,
      // 房屋信息
      room:{
        layer:undefined,
        section:undefined,
        apartment:undefined,
        builtUpArea:0.0,
        feeCoefficient:0.0,
        remark:undefined
      },
    }
  },
  methods: {

    /**
     * 添加房屋
     */
    addRoom(){
      // 房屋信息
      const room={
        unitId:this.unitId,
        layer:this.room.layer,
        section:this.room.section,
        apartment:this.room.apartment,
        builtUpArea:this.room.builtUpArea,
        feeCoefficient:this.room.feeCoefficient,
        remark:this.room.remark
      }
      addRooms(room).then(res => {
        if(res.data){
          this.$router.push('/village/house')
          this.$message({
            message: '添加成功!',
            type: 'success'
          });
        }
      })
    },

    /**
     * 获取楼栋id
     */
    getFloorId(floorId){
      this.floorId = floorId;
    },
    /**
     * 获取单元id
     */
    getUnitId(unitId){
      this.unitId = unitId
    },

    /**
     * 下一步
     */
    next() {
      if(this.active === 0 && this.floorId === 0){
        this.$message({
          message: '请选择楼栋信息哦!',
          type: 'warning'
        });
        return  false
      }
      if(this.active === 1 && this.roomId === 0 && this.unitId === 0){
        if(this.roomId === 0 ){
          this.$message({
            message: '请选择单元哦!',
            type: 'warning'
          });
          return  false
        }
      }
      if(this.active === 2){
        // 添加房屋代码
        this.addRoom()
        return false;
      }
      if (this.active++ >= 2){
        this.active = 0;
      }


    },

  }
}
</script>

<style scoped>

</style>
